<template>
  <el-container>
    <el-header>
      <el-form :inline="true" style="margin-top: 20px">
        <el-form-item label="关键字">
          <el-input v-model="keyword" placeholder="关键字" clearable @clear="clearConditions" ></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-search" @click="searchData"></el-button>
        </el-form-item>
      </el-form>
    </el-header>
    <el-main>
      <el-table height="100%" :data="dataTable.result" border highlight-current-row @row-dblclick="rowDbClick" >
        <el-table-column prop="name" label="名称" min-width="200"></el-table-column>
        <el-table-column prop="count" header-align="center" align="center" label="累计提交版本次数" width="150"></el-table-column>
        <el-table-column prop="lastVersionTime" header-align="center" align="center" label="最近一次提交时间" width="200"></el-table-column>
        <el-table-column prop="pubVersionId" header-align="center" align="center" label="当前发布的版本号" width="200"></el-table-column>
        <el-table-column prop="publishTime" header-align="center" align="center" label="发布时间" width="200"></el-table-column>
        <el-table-column label="操作" header-align="center" align="center" width="80">
          <template slot="header">
            <el-button type="text" icon="el-icon-download" @click="syncLastVersions" title="获取所有最新版本"></el-button>
            <el-button type="text" icon="el-icon-refresh" @click="query" title="刷新列表"></el-button>
          </template>
          <template slot-scope="scope">
            <el-button type="text" icon="el-icon-download" @click="getLastVersion(scope.row)" title="获取最新版本"></el-button>
            <el-button type="text" icon="el-icon-upload" @click="pubLastVersion(scope.row)" title="发布最新版本"></el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-drawer :title="'[' + (currentItem?currentItem.name:'') + ']所有版本'" :visible.sync="showVersioning" @closed="versionClosed" direction="rtl" size="40%">
        <mf-versioning :workItem="currentItem"></mf-versioning>
      </el-drawer>
    </el-main>
    <!--底部分页-->
    <el-footer>
      <el-pagination v-on:current-change="query" :current-page.sync="queryObject.pageIndex" :page-size="queryObject.pageSize" :total="dataTable.rowCount" layout="total, prev, pager, next"></el-pagination>
    </el-footer>
  </el-container>
</template>
<script>
export default {
  data() {
    return {
      queryObject: {
        pageIndex: 1,
        pageSize: 20,
        sortFields: {
          Name: false
        },
        parameters: {
          keyword: ""
        },
      },
      dataTable: {
        result: [],
        pageIndex: 1,
        pageSize: 20,
        pageCount: 0,
        rowCount: 0,
      },
      currentItem: {},
      showVersioning: false,
      keyword: null
    };
  },
  watch: {
  },
  computed: {
  },
  created() {
    this.query();
  },
  activated() {
    this.query();
  },
  methods: {
    searchData() {
      this.queryObject.parameters.keyword = this.keyword;
      this.query();
    },
    clearConditions() {
      if (this.queryObject.parameters.keyword != this.keyword) this.searchData();
    },
    query() {
      this.$service.version
        .query({ data: this.queryObject })
        .then(response => {
          if (response.success)
            this.dataTable = response.data;
        });
    },
    rowDbClick(row, column, event) {
      this.viewVersions(row);
    },
    viewVersions(row) {
      this.currentItem = row;
      this.showVersioning = true;
    },
    versionClosed() {
      this.currentItem = {};
      this.showVersioning = false;
    },
    syncLastVersions() {
      this.$service.version.syncLastVersions().then(response => {
        if (response.success) {
          alert("已成功同步所有项的最新版本");
        }
      });
    },
    getLastVersion(item) {
      this.$service.version
        .pull({ params: { name: item.name }})
        .then(response => {
          if (response.success) {
            alert("已成功下载[" + item.name + "]的最新版本");
          }
        });
    },
    pubLastVersion(item) {
      this.$service.version
        .publish({ params: { name: item.name } })
        .then(response => {
          if (response.success) {
            alert("已成功发布[" + item.name + "]的最新版本");
          }
        });
    }
  }
};
</script>
